;
(function(doc) {
    var oImgs = doc.getElementsByClassName('wf-item');
    console.log(oImgs);
    var oDiv = doc.getElementsByClassName('container')[0];
    oDiv.style.position = 'relative';
    var _arr = [];

    function init() {
        renderImg(oImgs);
    }

    function renderImg(oImgs) {
        for (let i = 0; i < oImgs.length; i++) {
            oImgs[i].style.display = 'block';
            oImgs[i].style.width = (1200 - 40) / 5 + 'px';
            oImgs[i].style.position = 'absolute';
            if (i < 5) {
                _arr.push(oImgs[i].offsetHeight);
                oImgs[i].style.top = '0';
                if ((i + 1) % 5 === 1) {
                    oImgs[i].style.left = '0';
                } else {
                    oImgs[i].style.left = i * ((1200 - 40) / 5 + 10) + 'px';
                }
            } else {
                minIdx = findMinIdx(_arr);
                oImgs[i].style.left = oImgs[minIdx].offsetLeft + 'px';
                oImgs[i].style.top = (_arr[minIdx] + 10) + 'px';
                _arr[minIdx] += (oImgs[i].offsetHeight + 10);
            }
        }
    }
    console.log(_arr);

    function findMinIdx(arr) {
        return [].indexOf.call(arr, Math.min.apply(null, arr));
    }

    window.onload = function() {
        init();
    }
})(document);